import { observe } from "./observe/index"

export function initState(vm) {
    // 又取出传递进来的参数
    let opts = vm.$options

    // 判断用户具体传递了哪些属性
    if (opts.props) {
        initProps()
    }
    if (opts.data) {
        initData(vm)
    }
    if (opts.watch) {
        initWatch()
    }
    if (opts.computed) {
        initComputed()
    }
    if (opts.methods) {
        initMethods()
    }
}

function initProps() { }
function initWatch() { }
function initComputed() { }
function initMethods() { }

// vue2对data进行初始化，data是可以写成对象的也是可以写成函数的，比如组件的data就是函数，解决作用域问题

function initData(vm) {
    // ----------------------------------------------------------
    // console.log("对data进行初始化....");
    let data = vm.$options.data

    // 处理data：如果是函数就执行，如果是普通对象就直接返回
    // 如果data是函数就执行函数，可以在html中改写成data函数输出this查看
    // 注意：data函数中默认this指向window这里使用call改变this指向为Vue
    data = vm._data = typeof data === "function" ? data.call(vm) : data

    // --------------------------------------------------------------
    // 将data上的所有属性代理到Vue实例上
    for (let key in data) {
        proxy(vm, "_data", key)
    }
    // --------------------------------------------------------------------
    // data数据进行劫持
    observe(data)
}
// -------------------------------------------------------------------
function proxy(vm, source, key) {
    Object.defineProperty(vm, key, {
        get() {
            return vm[source][key]
        },
        set(newValue) {
            vm[source][key] = newValue
        }
    })
}